<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%@ taglib uri="http://java.sun.com/jstl/core_rt" prefix="c"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>
<c:set var="path" value="${pageContext.request.contextPath }" />
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="renderer" content="webkit">
<meta http-equiv="Cache-Control" content="no-siteapp" />
<title>主页</title>
<link rel="shortcut icon" href="favicon.ico">
<!--[if lt IE 8]>
    <meta http-equiv="refresh" content="0;ie.html" />
    <![endif]-->

<!-- 本框架基本脚本和样式 -->
<script type="text/javascript"
	src="${path }/resource/js/jquery-2.1.4.min.js"></script>
<script type="text/javascript"
	src="${path }/resource/js/systools/MBase.js"></script>
<script type="text/javascript"
	src="${path }/resource/js/systools/echarts.js"></script>
<link rel="stylesheet" type="text/css"
	href="${path }/resource/font/iconfont.css" />
<style type="text/css">
.hkdg {
	width: 150px;
	margin: 5px;
	border: 1px solid #aeaeae;
	border-radius: 5px;
	padding: 3px;
}

blockquote {
	font-size: 14px;
	line-height: 25px;
}

.title {
	color: #6f5499;
	font-size: 32px;
	text-shadow: 2px 3px 2px #ababab;
}
/*排行榜*/
.ibox-content {
	padding: 0;
}

.no1 {
	height: 100px;
	position: relative;
}

.no1-title {
	background: red;
	position: absolute;
	left: 0;
	margin: auto;
	color: #fff;
	top: 0;
	bottom: 0;
	height: 20px;
	border-top-right-radius: 10px;
	border-bottom-right-radius: 10px;
	padding: 0 10px;
}

.no1-img {
	background: url(${path }/resource/images/No1.png);
	background-size: 100% 100%;
	width: 150px;
	height: 80px;
	margin: auto;
	position: absolute;
	top: 0;
	right: 0;
	left: 0;
	bottom: 0;
	text-align: center;
}

.no1-img img {
	width: 50px;
	height: 50px;
	border-radius: 50%;
	margin: auto;
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
}

.no1-img span {
	position: absolute;
	bottom: 0;
	right: 0;
	left: 0;
	margin: auto;
	color: #fff;
}

.ibox {
	box-shadow: 2px 3px 10px #ddd;
}

.ibox-title {
	border: none;
	border-top-right-radius: 5px;
	border-top-left-radius: 5px;
}

.box-shadow {
	box-shadow: 10px 10px 10px #eee;
}

.color-name {
	font-weight: 700;
	color: #333;
}

.color-y {
	color: #ff8600;
	text-shadow: 1px 1px 0 #eee;
}

.color-2 {
	color: #1c84c6;
	text-shadow: 0 0 20px #1c84c6;
}

.color-3 {
	color: #ed5565;
	text-shadow: 0 0 20px #ed5565;
}

.no1-msg {
	position: absolute;
	right: 0;
	bottom: 0;
	top: 0;
	margin: auto;
	margin-right: 5%;
	height: 20px;
	text-align: center;
}
.widget{
}
.no1-msg span {
	font-weight: 600;
	margin-left: 10px;
}

.no1-msg img {
	height: 20px;
}

.user-head {
	width: 40px;
	height: 40px;
	border-radius: 50%;
	margin-right: 5px;
}

.text-center {
	text-align: center;
}

.iconfont {
	font-size: 40px;
}
.blue-bg {
    background-color:#0088cc;
    color: #fff;
}
</style>
</head>

<body style="padding: 20px;">
	<div class="row" id="warp">
		<div class="col-md-12">
			<div class="panel panel-default">
				<div class="panel-heading">
					我的项目<a href="${path }/admin/redirect/story-board" >看板</a>
				</div>
				<div class="panel-body">
					<div class="row">
						 
						<div class="col-sm-3" v-for="project in projects">
							<div class="widget blue-bg p-lg text-center ">
								<a class="J_menuItem" :href="'${path}/admin/projectInfo/sonManager?id='+project.id" data-index="4">
								<div class="m-b-md">
									<i class="iconfont icon-mk1 fa-4x" style="color: #fff"></i>
									<h1 class="m-xs" id="d"></h1>
									<span style="color: #fff">{{project.projName}}</span>
								</div>
								</a>
							</div>
						</div>

					</div>
				</div>
			</div>

		</div>
	</div>
	 </body>
	 <script src="${path }/resource/js/vue.js"></script>
	 <script type="text/javascript">
	 var app=new Vue({
			el:"#warp",
			data: {
				projects: []
			  },
	 });
	 
	 
	 $.AjaxProxy( ).invoke("${path}/admin/project/showList?limit=20", function(loj) {
			 app.projects=loj.getValue("rows");
		});
	 </script>
</html>